<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="emploee.js"></script>
    <script src="emService.js"></script>

    <style>
        .hidDiv {
            background-color: rgba(0, 0, 255, 0.4);
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            visibility: hidden;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .contentDiv {
            width: 700px;
            height: 500px;
            background-color: white;
            padding: 50px;
        }
    </style>
</head>

<body>
<table border="1" width="80%">
    <thead>
    <tr>
        <th>编号</th>
        <th>姓名</th>
        <th>工资</th>
        <th>性别</th>
        <th>操作</th>
    </tr>
    </thead>

    <tbody id="data"></tbody>
</table>

<span>查询：</span>
<input type="text" id="findByName">
<input type="button" value="查找" onclick="findByName()"><br>
<input type="button" value="添加" onclick="showAdd()">


<div class="hidDiv" id="addDiv">
    <div class="contentDiv">
        编号：<input type="text" id="codeTxt"><br>
        姓名：<input type="text" id="emNameTxt"><br>
        工资：<input type="text" id="moneyTxt"><br>
        性别：<input type="text" id="sexTxt"><br>
        <input type="button" value="确认添加" onclick="add()"><br>
        <span id="err"></span>
    </div>
</div>
<div class="hidDiv" id="updateDiv">
    <div class="contentDiv">
        编号：<span id="codeSp"></span><br>
        姓名：<span id="nameSp"></span><br>
        工资：<input type="text" id="updateMoneyTxt"><br>
        性别：<span id="sexSp"></span><br>
        <input type="button" value="确认修改" onclick="update()"><br>
    </div>
</div>
</body>
</html>